import React from 'react';
import axios from 'axios'
import './homegoods.scss'
import withhook from '../component/widthhook'

class Homegoods extends React.Component{
    constructor(props){
        super(props)
        this.state={
            tabIndex:-1,
            title:[],
        }
    }
    product(i,t){
     

    }
    componentDidMount(){
        axios.get('https://apipc-xiaotuxian-front.itheima.net/home/goods').then((res)=>{
            if(res.data){
                this.setState({
                    title:res.data.result
                })
            }
        })
    }
    render(){
        const {tabIndex,title,asd} = this.state
        return(
            <div className='homegoods'>
                <div id="app">
                    {
                        title&&title.map((A,index)=>{
                            return (
                                <div key={A.id} className="content">
                                    <div className="head">
                                        <h3>
                                            {A.name}
                                        </h3>
                                        {
                                            A.children&&A.children.map((B,index)=>{
                                                return (
                                                    <div key={B.id} className="sub">
                                                        <span >{B.name}</span>
                                                    </div>
                                                )
                                            })
                                        }
                                        
                                        <span >查看全部<i></i></span>
                                    </div>
                                    <div className="box">
                                        <div className="img">
                                            <section>
                                                <span>{A.name}馆</span>
                                                <span>{A.saleInfo}</span>
                                            </section>
                                            <img src={A.picture} alt="" />
                                        </div>
                                        <ul>
                                            {
                                                A.goods&&A.goods.map((C,index)=>{
                                                    return (
                                                        <li key={C.id}
                                                        onClick={this.product.bind(this,C)}>
                                                            <div className="good-item">
                                                                <img src={C.picture} alt="" />
                                                                <p>{C.name}</p>
                                                                <p>{C.desc}</p>
                                                                <p>￥{C.price}</p>
                                                                <div className='extra'>
                                                                    <span>找相似</span>
                                                                    <span>发现更多宝贝</span>
                                                                </div>
                                                            </div>
                                                        </li>
                                                    )
                                                })
                                            }
                                        </ul>
                                    </div>
                                </div>
                            )
                        })
                    }
                   
                </div>
            </div>
        )
    }
}

const aqwe = withhook(Homegoods)
export default aqwe